
/* reset*/body,h1,h2,h3,h4,h5,p,dl,dd,ul,ol,form,input,textarea,th,td,select{margin:0;padding:0;}
em{font-style:normal;}
li{list-style:none;}
a{text-decoration:none;}
/*img{border:none;vertical-align:top;}*/
table{border-collapse:collapse;}
input,textarea{outline:none;}
textarea{resize:none;overflow:auto;}
body{font-size:12px;font-family:"Microsoft YaHei";}
/* end reset*/
/* 浮动*/
.clear{zoom:1;}
.clear:after{content:'';display:block;clear:both;}
.fl{float:left;}
.fr{float:right;}
/*显示 隐藏*/
.hide{
    display: none;
}
.show{
    display: block;
}

body{background: url(img/bg.jpg) no-repeat;background-size: cover;background-color: #eef3fa;}
.header{width: 1200px;margin: 0 auto;    height: 145px;
    line-height: 145px;color: #ffffff;font-size: 18px;position: relative;}
.header img{vertical-align: middle;}
.closeBtn{display: inline-block;cursor: pointer;margin-right: 210px;width: 48px;height: 57px;background: url("img/closeBtn.png") 5px 4px no-repeat;}
#log_reg{position: relative;padding: 0 10px;float: right;
    color: #000000;}
#log_reg a,#log_reg span{font-size: 16px;height: 26px;line-height: 26px;position: relative;padding: 0 5px;display: inline-block;cursor: pointer;}
#log_reg img,.user img{width: 50px;
    height: 50px;display: inline-block;vertical-align: middle;}
.admin {
    display: inline-block;
    color: #000;
}
#ruleTip ,#regBoard,#loginBoard{position: fixed;width: 1000px;height: 594px;top: 50%;left: 50%;margin: -297px 0 0 -500px;display: none;background-image: URL('img/dialog-bg.png');}
#regBoard #namePwd,#login-namePwd{text-align: center;width: 300px;margin-left: 250px;margin-bottom: 20px;}
#regBoard #namePwd li,#login-namePwd li{margin: 8px 0;}
#regBoard #namePwd li input ,#login-namePwd li input{    padding-left: 10px;width: 242px;height: 25px;line-height: 25px;font-size: 18px;border: 0;border-bottom: 1px solid #b0b0b0;}
#loginBoard .title, #regBoard .title{padding: 0 15px;height: 57px;line-height: 57px;}
.c-title{text-align: left;height: 57px;line-height: 57px;color: #fff;font-size: 18px;}
#ruleTip ol{
    width: 740px;display: block;height: 70%;padding: 30px;overflow-y: auto;font-size: 16px;}
#ruleTip ol li{position: relative;list-style: circle;width: 100%;margin: 5px 0;line-height: 25px;color: #001F3F;}
#ruleTip .btn,#regBoard .btn,#loginBoard .btn{display: inline-block;border-radius: 5px;background: #64a3fa;color: #fff;cursor: pointer;}
#registNow{
    background: #64a3fa;
    width: 300px;
    padding: 10px 0;
    font-size: 16px;
    margin-top: 15px;
}
#ruleTip #regBoard #registNow,#loginBoard #loginNow{background: #64a3fa;
    width: 300px;
    padding: 10px 0;    font-size: 16px;    margin-top: 15px;}
#c-agree,#c-cancel{
    width: 150px;
    padding: 10px 0;
    font-size: 18px;
}
#c-agree{
    margin-right: 20px;
    background: #286edd !important;
}
#c-cancel{
    margin-right: 0px !important;
    background-color: #8f8f91 !important;
}
#ruleTip p{text-align: center;    width: 800px;}
#login-namePwd li span{display: inline-block;width: 38px;height: 38px;text-align: center;}
#login-namePwd .pw{background-image: url("img/pw.png");vertical-align: bottom;}
#login-namePwd .account{background-image: url("img/account.png");vertical-align: bottom;}
.keyBoard{width: 94%;padding: 0 3%;margin-left: -100px;margin-top: 40px;text-align: center;}
.keyBoard a{display: inline-block;width: 52px;height: 52px;margin: 5px;border-radius: 5px;text-align: center;line-height: 52px;font-size: 28px;color: #fff;font-weight: bold;cursor: pointer;}
.keyBoard a:active{box-shadow: inset 0 0 10px #64a3fa;}
.num-a a{background-image: url('img/num.png');}
.key-a a{background-image: url('img/key-b.png');}
.main{width: 1200px;margin: 0px auto 20px;}
.list{width: 1200px;margin: 0;text-align: center;min-height: 400px;}
.list li img{width: 214px;height: 214px;padding-bottom: 15px;padding-top: 10px;}
.list li:last-child{
    margin-right: 0!important;
}

#login-namePwd li.zhzc {
    text-align: left;
    font-size: 18px;
    margin: 15px 10px;
    color: #50a2ea;
    text-decoration: underline;
}
.main .first-list{
    background: url("img/first-bg.png") no-repeat;
    width: 820px;
    height: 400px;
    margin: 0 auto;
    position: relative;
    left: 220px;
    top: 155px;
}
.main .startRead,.main .rank{
    width: 178px;
    height: 178px;
    position: absolute;
    cursor: pointer;
}
.main .startRead{
    background: url("img/startRead.png") no-repeat;
    top: -100px;
    left: 330px;
}
.main .rank{
    background: url("img/rank.png") no-repeat;
    left: 30px;
}
.main .list li{float: left;position: relative;background: #dbeef4;border-radius: 10px;width: 24%;height: 400px;margin-right:1.3333333333333%;}
.list li a span{display: inline-block;width: 100%;border-radius: 0px 0 10px 10px;height: 50px;font-family: "Microsoft YaHei";line-height: 50px;margin-bottom: -1px;font-size: 40px;letter-spacing: 10px;font-weight: 400;}
.list li a{color: #ffffff;font-size: 30px;width: 215px;height: 280px;position: absolute;margin-left: -100px;margin-top: -140px;top: 50%;left: 50%;}
.copyright strong a{color:#000;}
.footer{width: 1200px;margin: 0 auto;}
.footer .footer-content{height: 200px;    position: relative;
    top: 135px;}
.footer .copyright{text-align: right;line-height: 60px;font-size: 16px;}
.footer-content{
   
}
.footer ul {
    position: absolute;
    left: 155px;
    color: #333;
    line-height: 30px;
    top:50px;
}

.box{margin-right:-2%;}
.box li{float: left;margin-right: 2%;margin-bottom: 15px;width: 23%;font-size: 24px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;height: 60px;text-align: center;line-height: 60px;background: #05b68c;}
.classify{background: url(img/classify.png) no-repeat 13px 4px;background-size: 40px 40px;}
.box{color: #ffffff;margin: 0px auto;min-height:560px;margin-right: -2%;}
.main4{width: 1200px;margin: 0 auto;padding-bottom: 20px;}
.part-noVideo,.part-Video{width: 1200px;margin: 0 auto;
    height: 400px;
    position: relative;}
.part-Video .time{
    position: absolute;
    right: 30%;
    color: #fff;
    background: url("img/time-bg.png");
}
.part-Video .time p{
    padding-left: 8px;
    padding-right: 8px;
    letter-spacing: 3px;
}
.part-noVideo .type{width: 25%;float: left;
    text-align: center;
    background-color: #d8f9ee;
    height: 100%;
    position: relative;}
.type .time{
    position: absolute;
    left:0px;
    top: 0px;
    background: url("img/time-bg.png");
}
.part-noVideo .type img{display: inline-block;
    margin-top: 50px;
    margin-bottom: 20px;}
.part-noVideo .type span{
    color: #000;
    font-size: 34px;
    letter-spacing: 3px;
}
.part-noVideo .type .time p{
    padding-left: 8px;
    padding-right: 8px;
    color: #ffffff;
    vertical-align: middle;
}
.part-noVideo .type .time p span{
    color: #ffffff;
    font-size: 36px;
    font-weight: bold;
}
.artical{line-height: 30px;width: 75%;float: left;height: 400px;position: relative;overflow: hidden;}
#vd{
    float: left;

}
.part-Video .size-roll{
    width: 29%;
    float: right;
    height: 400px;
    overflow: hidden;
}
.size-content{
    height: 100%;
    padding: 15px;
    background: #196db6;
}
.first-main{
    margin-top: 90px;
}
.main-list{
    height: 500px;
    position: relative;
    padding: 15px 10px;
    background-color: rgba(41,187,224,0.7);
    /*opacity:0.7;*/
}
.main-read{
    height: 630px;
    position: relative;
    padding: 15px 10px;
    margin: 0px auto 50px;
    background-color: rgba(41,187,224,0.7);
}
.page {
    width: 1000px;
    margin: 0 auto;
}
.page li {
    width: 16%;
    float: left;
    margin-right: 5%;
    background: #3f70b3;
}
.page li a {
    display: inline-block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding-left: 62px;
    color: #ffffff;
    font-size: 20px;
}
.page .classify {
    background: url(img/classify.png) no-repeat 13px 4px;
    background-size: 40px 40px;
}
/*摄像底部*/
.camera-direct{width: 43%;color: #fff;}
.camera-direct p{font-size: 18px;margin: 10px 0px;color: #fff;}
.camera-direct .words-speed{
    padding-right: 77px;
}
.audio-play{width: 100%;margin-top: 25px;}
.camera-direct .dir,.speed-btn{display: inline-block;width: 64px;height: 64px;line-height: 64px;text-align: center;border-bottom: 3px solid rgba(0,0,0,0.25);border-right: 1px solid rgba(0,0,0,0.25);border-radius: 5px;font-size: 22px;margin-right: 18px;color: #fff;margin-bottom: 10px;}
.camera-direct .dir{
    background-color: #ffc271;
    vertical-align: middle;
}
.speed-btn{
    background-color: #06f274;
    font-size: 40px;
    vertical-align: middle;
    position: absolute;
    bottom:0px;
    right: 10px;
}
.add-btn{
    background: url("img/add.png") no-repeat 7px 9px ;
    right: 90px;
}.stop-btn{
    background: url("img/begin.png") no-repeat 7px 9px ;
    right: 175px;
}.stop-btn2{
    background: url("img/stop.png") no-repeat 7px 9px ;
    right: 175px;
}
.reduce-btn{
    background: url("img/reduce.png") no-repeat 7px 9px;
}
.camera-direct .font-big{font-size: 40px;vertical-align: middle;}
.camera-direct .re-select{width: 130px;padding-left: 30px;background: url("img/re-select.png") 8px #ffc271 no-repeat;}
#player{width: 300px;height: 110px;padding: 25px;position: relative;float: left;background: rgba(0, 0, 0, 0.5);border-radius: 5px;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);}
#player{width: 45%;height: 130px;padding: 20px;position: relative;float: left;background: #4f685f;border-radius: 5px;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);}
#player>span{font-size: 20px;color: #fff;}
#player .cover{background: rgba(0, 0, 0, 0.5);border: 1px solid #333;position: absolute;top: 25px;left: 25px;overflow: hidden;-moz-border-radius: 10px;-webkit-border-radius: 10px;-o-border-radius: 10px;-ms-border-radius: 10px;-khtml-border-radius: 10px;border-radius: 10px;width: 130px;height: 130px;-moz-box-shadow: 0 2px 10px black;-webkit-box-shadow: 0 2px 10px black;-o-box-shadow: 0 2px 10px black;box-shadow: 0 2px 10px black;}
#player .cover img{-moz-border-radius: 10px;-webkit-border-radius: 10px;-o-border-radius: 10px;-ms-border-radius: 10px;-khtml-border-radius: 10px;border-radius: 10px;width: 130px;height: 130px;}
#player .ctrl{text-shadow: 0 1px 2px #000;line-height: 16px;}
#player .ctrl .tag strong, #player .ctrl .tag span{display: block;text-overflow: ellipsis;}
#player .ctrl .tag span{font-size: 12px;margin-top: 5px;color: #ccc;}
#player .ctrl .icon{background-repeat: no-repeat;background-position: center;display: inline-block;opacity: 0.6;cursor: pointer;width: 24px;height: 24px;-moz-transition: 0.3s;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;-moz-user-select: none;-khtml-user-select: none;-webkit-user-select: none;-o-user-select: none;user-select: none;}
#player .ctrl .icon:hover, #player .ctrl .icon.enable{opacity: 1;}
#player .ctrl .icon:active{opacity: 0.3;}
#player .ctrl .control{margin-top: 10px;height: 25px;}
#player .ctrl .control .rewind{background-image: url(img/rewind.png);}
#player .ctrl .control .playback{background-image: url(img/play.png);}
#player .ctrl .control .playback.playing{background-image: url(img/pause.png);}
#player .ctrl .control .fastforward{background-image: url(img/fastforward.png);}
#player .ctrl .control .volume .mute{background-image: url(img/volume.png);}
#player .ctrl .control .volume .mute.enable{background-image: url(img/mute.png);}
#player .ctrl .control .volume .slider{margin-top: 11px;margin-left: 10px;width: 100px;}
#player .ctrl .progress{margin-top: 10px;}
#player .ctrl .progress .timer{font-size: 16px;color: #ccc;margin-top: 8px;}
#player .ctrl .progress .repeat, #player .ctrl .progress .shuffle{background-position: center bottom;}
#player .ctrl .progress .repeat{background-image: url(img/repeat.png);}
#player .ctrl .progress .repeat.once, #player .ctrl .progress .repeat.all{opacity: 1;}
#player .ctrl .progress .repeat.once{position: relative;}
#player .ctrl .progress .repeat.once:before{content: "1";position: absolute;top: 3px;right: -2px;font-size: 8px;}
#player .ctrl .progress .shuffle{background-image: url(img/shuffle.png);}
.slider{background: #374842;height: 5px;position: relative;cursor: pointer;-moz-border-radius: 5px;-webkit-border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) inset;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) inset;-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) inset;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) inset;}
.slider:hover a, .slider.enable a{opacity: 1;}
.slider a{background: #fff;margin-left: -2.5px;position: absolute;opacity: 0;width: 5px;height: 5px;-moz-border-radius: 50%;-webkit-border-radius: 50%;-o-border-radius: 50%;-ms-border-radius: 50%;-khtml-border-radius: 50%;border-radius: 50%;-moz-transition: opacity 0.3s;-webkit-transition: opacity 0.3s;-o-transition: opacity 0.3s;transition: opacity 0.3s;}
.slider .loaded, .slider .pace{position: absolute;height: 100%;opacity: 0.7;-moz-border-radius: 5px;-webkit-border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;}
.slider .loaded{background: rgba(255, 255, 255, 0.1);}
.slider .pace{background: #258fb8;}
#playlist{background: #374842;width: 280px;height: 138px;margin-left: 20px;padding: 10px 15px;list-style: none;position: relative;-moz-border-radius: 5px;-webkit-border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;-moz-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);-webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);-o-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);}
#playlist li{color: #aaa;line-height: 38px;font-size: 16px;padding-left: 25px;cursor: pointer;text-overflow: ellipsis;-moz-transition: 0.3s;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;width: 28%;float: left;}
#playlist li:hover{color: #fff;}
#playlist li.playing{background: url(img/playing.png) no-repeat 0 center;color: #fff;font-weight: bold;}
#playlist{background: #4f685f;width: 45%;height: 150px;margin-left: 20px;list-style: none;position: relative;-moz-border-radius: 5px;-webkit-border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;-moz-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);-webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);-o-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);}
marquee{
    font-size: 16px;
}
marquee h3{
    font-size: 18px;
}
marquee h3,marquee p{
    text-align: center;
}

/*朗读按钮*/
.footer .read-btn{
    width: 100%;
    text-align: center;
}
.footer .read-btn a{
    display: inline-block;
    width: 312px;
    height: 98px;
    line-height: 98px;
    font-size: 40px;
    margin-right: 40px;
    padding-left: 20px;
    color: #ffffff;
}
.start-btn{
    background: url("img/start-btn.png") no-repeat;
}
.start-btn,.save-btn{
    background: url("img/save-btn.png") no-repeat;
}
.over-btn{
    background: url("img/over-btn.png") no-repeat;
    margin-right: 0 !important;
}
.over-main{
    width: 730px;
    margin: 0 auto;
    background: rgba(70,186,225,0.7);
    background: #46bae1;
    filter: 0.7;
    padding:8px 10px;
}
.over-main img{
    display: inline-block;
    width: 730px;
    height: 380px;
    margin-bottom: 10px;
}
.login_wx img{
    width: 230px;
    height: 215px;
    margin-right: 10px;

}
.tipol li {
    width: 460px;
    padding-left: 30px;
    text-align: left;
    color: #fff;
    font-size: 22px;
    height:50px;
    line-height: 50px;
    margin-bottom: 5px;
    background: url("img/dot.png") 8px 17px no-repeat #2883dc;
}